<template>
<!-- click-left点击左侧区域内容 -->
  <van-nav-bar
    class="top-navbar"
    :title="title"
    :right-text="rightText"
    @click-left="goBack"
    @click-right="$emit('click-right')"
  >
  <!-- 自定义左侧区域内容 -->
    <template #left>
      <i class="iconfont iconbtn_nav_back"></i>
    </template>
  </van-nav-bar>
</template>

<script>
export default {
  name: 'mmNavBar',
  props: ['title', 'back', 'rightText'], // back返回的路由
  methods: {
    goBack () {
      this.$router.replace(this.back)
    }
  }
}
</script>

<style lang='less'>
.top-navbar {
  height: 44px;
  .iconfont {
    font-size: 44px;
    font-weight: 500;
    color: @main-font-color;
  }
  .van-nav-bar__left {
    padding: 0;
  }
  .van-nav-bar__title {
    font-size: 18px;
    font-weight: 600;
    color: @main-font-color;
  }
  .van-nav-bar__text {
    font-size: 14px;
    color: @main-font-color;
  }
}
</style>
